<!--
* @description 警情订阅
* @author zywu
* @date 2021/11/09 14:27:58
!-->
<template>
  <el-dialog :close-on-click-modal="false" :visible.sync="visible" title="警情订阅" width="600px" center>
    <el-form label-width="120px" ref="editForm" @submit.native.prevent style="min-height:240px;">
      <el-form-item prop="fbsIds" label="选择建筑物">
        <el-cascader
          ref="myCascader"
          v-model="relateBuildIds"
          :options="buildList"
          :props="nodeProps"
          clearable
          filterable
          collapse-tags
          style="width:100%;"
        ></el-cascader>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible=false">取消</el-button>
      <el-button type="primary" @click="handleSaveSubscribe">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import {
  getOrgFbsTree,
  saveSubscribe,
  getUserBuildByAccount,
} from '@/api/sysConfig'
import { mapGetters, mapState } from 'vuex'

export default {
  components: {},

  data() {
    return {
      visible: false,
      buildList: [],
      relateBuildIds: [],
      nodeProps: {
        multiple: true,
        value: 'id',
        label: 'text',
        children: 'nodes',
        emitPath:false
        // lazy: true,
        // lazyLoad: (node, resolve) => {
        //   if(!node.data){
        //     return resolve([])
        //   }
        //   let parames = {
        //     organizationId: node.data.organizationId,
        //     parentId: node.data.id,
        //     queryType: 0,
        //   }
        //   getFbsListExt(parames).then((res) => {
        //     resolve(
        //       res.data.map((n) => {
        //         n.leaf=n.hasChildren!=1
        //         return n
        //       })
        //     )
        //   })
        // },
      },
    }
  },

  computed: {
    ...mapGetters(['isMuilUnitUser', 'userOrgId', 'userOrgIds']),
    ...mapState(['userinfo']),
  },

  created() {},

  mounted() {},

  methods: {
    init() {
      this.visible = true
      this.id=''
      this.relateBuildIds=[]
      this.getBuildList()
    },
    getBuildList() {
      getOrgFbsTree({
        orgIds: this.isMuilUnitUser ? this.userOrgIds : this.userOrgId,
      }).then((res) => {
        this.buildList = res.data
        this.$nextTick(() => {
          this.getUserBuildByAccount()
        })
      })
    },
    getUserBuildByAccount() {
      getUserBuildByAccount({
        account: this.userinfo.accountName,
      }).then((res) => {
        if (res.data) {
          this.id = res.data.id
          this.relateBuildIds = res.data.relateBuildIds
            ? res.data.relateBuildIds.split(',').map((n) => {
                return parseInt(n)
              })
            : []
        }
      })
    },
    handleSaveSubscribe() {
      let relateBuildIds=this.$refs.myCascader.getCheckedNodes().map(n=>{
        return n.data.id
      }).join(',')
      saveSubscribe({
        id: this.id,
        userAccount: this.userinfo.accountName,
        relateBuildIds,
      }).then((res) => {
        if (res.status === 200) {
          this.$message({
            message: '保存成功！',
            type: 'success',
          })
          this.visible = false
        } else {
          this.$message.error(res.info)
        }
      })
    },
  },
}
</script>
<style lang='scss'>
</style>